<template>
	<div class="giftDetails clearfix">
		<div class="giftDetailsMain clearfix">
			<SearchTop></SearchTop>
			<bindPhone></bindPhone>
			<Footer></Footer>
			<div class="mianTop">
				<div class="mainTopL">
					<div class="img">
						<img :src="data.bag.imageCenter" alt="">
					</div>
					<div class="info">
						<p class="title">{{data.bag.name}}</p>
						<p class="alertInfo">提示: 需要绑定手机号才能领取礼包!</p>
						<p class="btnMain">
							<a v-if="!getGift" class="getGift" @click="getGift(data.bag.code)">领取礼包</a>
							<a v-if="getGift" class="getGiftNo" >已领取</a>
							<a class="getGift" @click="gameStart(data.soft.softName,data.bag.gameName,data.soft.softId)">进入游戏</a>

							<!--  cpId 游戏名称  softId ,区服id,区服名 -->
						</p>
					</div>
				</div>
				<div class="mainTopR">
					<div class="img">
						<img :src="data.bag.imageCenter" alt="">
					</div>
					<p>还剩{{data.bag.surplusNumber}}个礼包</p>
				</div>
			</div>
			<div class="giftCneter">
				<div class="giftCneterL">
					<div class="leftTitle">礼包内容</div>
					<div class="list">
						<div class="listItem" v-for="(item,index) in data.bag.contents"> 
							<div class="img">
								<img :src="item.image" alt=""/>
							</div>
							<p>{{item.name}}</p>
						</div>
						
					</div>
					<div class="leftTitle">领取方式</div>
					<div class="giftType">
						<div class="item" v-for=" item in data.bag.rewards">
							<!-- <p>1.点击游戏右上角 <span>"福利大厅"</span>(50级开启)</p> -->
							<p>{{item.descr}}</p>
							<div class="img">
								<img style="width: 100%;height: 100%;" :src="item.image">
							</div>
						</div>
						
					</div>
					<div class="leftTitle">奖励说明</div>
					<div class="giftInfo">
						<p>1.同种礼包每个账号只能领取1次。</p>
						<p>2.同种礼包每个游戏角色只能激活1次。</p>
						<p>3.一个礼包码只能激活1次，激活后失败。</p>
					</div>
				</div>
				<div class="giftCneterR">
					<div class="hotGift">
						<div class="title">
							<searchTitle text="热门礼包" imgUrl="../../../static/img/hotGift.png"></searchTitle>
						</div>
						<div class="listGiftR">
							<div class="listItem" v-for="item in hotGiftList">
								<div class="img">
									<img :src="item.imageHot" alt="">
								</div>
								<div class="itemRight">
									<p style="color:#000000;">{{item.name}}</p>
									<p>{{item.name}}</p>
									<p>还剩 {{item.surplusNumber}} <a @click="goGiftDeta(item.code)"  class="getGift">立即领取</a></p>
								</div>
							</div>
						</div>
					</div>
					<div class="likeGift">
						<div class="title">
							<searchTitle text="猜你喜欢" imgUrl="../../../static/img/love.png"></searchTitle>
						</div>
						
						<div class="listGiftR">
							<div class="listItem" v-for="item in guseLike">
								<div class="img">
									<img :src="item.imageMybag" alt="">
								</div>
								<div class="itemRight">
									<p style="color:#000000;">{{item.name}}</p>
									<p>{{item.type | giftType}}</p>
									<p>还剩 {{item.surplusNumber}} <a  @click="goGiftDeta(item.code)" class="getGift">立即领取</a></p>
								</div>
							</div>
						</div>
					</div>s
				</div>
			</div>
			

		</div>
		
		
	</div>
	

</template>
<style scoped lang="less" src="./style.less"></style>
<script src="./script.js"></script>
